Turvalisus - autopublish

Eemaldan paki autopublish. Selle paki mõte on arendamise ajal lihtsustada admebaasi andmete vaatamist kliendi poolt. Lõppversioonis on see turvaprobleem ja tuleb eemaldada ning muuta Meteoris juurdepääsu andmete kasutamisele.

Andmete kättesaamiseks tuleb nüüd serveri poolelt vajalikud andmed avaldada (publish) ja kliendi poolelt tellida (subscribe) need andmed

Tõstan import/api/Items.js failis kõik meetodid serverikontrolli tingimusse.

if (Meteor.isServer) {
}

Lisan sinna publish funktsiooni:

Meteor.publish('allItems',function() {
    return Items.find(); 
  });

failis /imports/client/App.js lisan konteinerisse subscribe funktsiooni:

let itemsSub = Meteor.subscribe('allItems');

lisan samasse konteinerisse veel ühe props-i

ready: itemsSub.ready(),

mis kasutab tellimuse muutujat itemsSub ja meetodit ready(), mis on tõene kui andmed on saadaval. App.js-s lisan veel tingimuse: render() funktsiooni olemasoleva tagastamise (return) ette

if(!this.props.ready) {
   return (
     <div>laen..</div>
   )
 }

Uus App.js:

import React, {Component} from 'react';
import { createContainer} from 'meteor/react-meteor-data';
import Item from './Item';
import Items from '../api/Items';

class App extends Component {
  addItems(event) {
    event.preventDefault(); //takistab lehe uuestilaadimist
    //Mongosse andmete lisamine
    //salvestan vormi väärtused muutujatesse
    const asiYks=this.refs.asiYks.value.trim();
    const asiKaks=this.refs.asiKaks.value.trim();
    //lisatakse vaid siis kui vormi välja pole tühjad
    if(asiYks!='' && asiKaks!=''){
      //kutsub välja serverimeetodi ja kui andmed on korrektsed eale lisamist tühjendame vormi väljad
    Meteor.call('insertNewItem',asiYks,asiKaks,(err,res) =>{
      if(!err) {
        this.refs.asiYks.value ='';
        this.refs.asiKaks.value='';
      }
    });
    }
  }
  render () { //alati peab olema komponendi osa
 if(!this.props.ready) {
   return (
     <div>laen..</div>
   )
 }
    return ( // render funktsioon peab midagi tagastana, see on JSX
<div>
      <header>
        <h1>Hääletusäpp</h1>

      </header>
      <main>
        <form className='new-items' onSubmit={this.addItems.bind(this)}>
          <input type='text' ref='asiYks'/>
          <input type='text' ref='asiKaks'/>
          <button type='submit'>Lisa</button>
        </form>
        {this.props.items.map((item)=>{
        return <Item item={item} key= {item._id} />
        })}
      </main>
</div>
    );
  }
}
//Wrapper  andmete lisamiseks klassile App
export default createContainer(() =>{
  let itemsSub = Meteor.subscribe('allItems');
  return {
    ready: itemsSub.ready(),
    items: Items.find().fetch()
  }
},App);

Uus Items.js:

import { Mongo } from 'meteor/mongo';
const Items = new Mongo.Collection('items');
if (Meteor.isServer) {
  Meteor.publish('allItems',function() {
    return Items.find(); 
  });

    Meteor.methods({
      insertNewItem(asiYks,asiKaks) {
        check(asiYks,String);
        check(asiKaks,String);
        Items.insert({
          asiYks: {
            text:asiYks,
            value: 0,
          },
          asiKaks: {
            text:asiKaks,
            value: 0,
          }
        });
      },
      voteOnItem(item,position){
        if(position == 'asiYks') {
          Items.update(item._id, {
            $inc: {
              'asiYks.value': 1
            }
          })
        } else {
          Items.update(item._id, {
            $inc: {
              'asiKaks.value': 1
            }
          })
        }

        }

      });
}
export default Items;

Last updated