Turvalisus - insecure

Eemaldada insecure pakk

meteor remove insecure

Selle tulemusena enam andmeid kliendi poolt Mongodb baasi lisada ei lubata:

insert failed: Access denied

Lahenduseks on kasutada Meteori meetodit Meteor.methods() , mida saab välja kutsuda kliendi poolt kuid mis jooksevad serveris.

Lisan meetodid faili /imports/api/Items.jskuigi see võib olla ka nt failis collections.js vms. Lisan sinna kirjete lisamise osa mis tuleb võtta App.js-st.

import { Mongo } from 'meteor/mongo';
const Items = new Mongo.Collection('items');
Meteor.methods({
  insertNewItem(asiYks,asiKaks) {
    Items.insert({
      asiYks: {
        text:asiYks,
        value: 0,
    },
    asiKaks: {
      text:asiKaks,
      value: 0,
  }
  }
});
export default Items;

App.js-s asendan kirjete lisamise osa meetodi väljakutsumisega:

Meteor.call('insertNewItem',asiYks,asiKaks);

Et kontrollida argumentide väärtusi on üks variant kasutada andmebaasi skeemi, teine variant Meteori pakki check. Kasutan viimast:

meteor add check

ja lisan enne sisestavate andmete lisamist kontrolli:

check(asiYks,String);
check(asiKaks,String);

st need peavad olema stringid, muul juhul saadakse konsoolile veateade. Et kontrollida ka kliendipoolt st frontendi tuleb meetodi väljakutsumisel App.js-s lisada nn callback funktsioon:

Meteor.call('insertNewItem',asiYks,asiKaks,(err,res) =>{
      if(!err) {
        this.refs.asiYks.value ='';
        this.refs.asiKaks.value='';
      }
    });

Praegusel juhul tühjendatakse vormi väljad vaid juhul kui andmed pole vigased,

Analoogiliselt tuleb meetodi abil uuendada hääletuste arvu. Selleks võtan Item.js-st funktsiooni voteOne() sisu ja kasutan seda Items.js-s Meteori meetodite osas, luues uue funktsiooni voteOnItem():

voteOnItem(item,position){
    if(position == 'asiYks') {
      Items.update(item._id, {
        $inc: {
          'asiYks.value': 1
        }
      })
    } else {
      Items.update(item._id, {
        $inc: {
          'asiKaks.value': 1
        }
      })
    }
  }

Siin kasutatakse argumentide abil eristust et millisele elemendile hääletusi lisatakse.

Item.js-s asendan voteOne() _ja voteTwo() sisu kus edastatakse serverifunktsioonile ka argumendid:

voteOne(){
    Meteor.call('voteOnItem',this.props.item,'asiYks');
  }
  voteTwo(){
    Meteor.call('voteOnItem',this.props.item,'asiKaks');
  }

Item.js:

import React, {Component} from 'react';
import Items from '../api/Items';
export default class Item extends Component {
  voteOne(){
    Meteor.call('voteOnItem',this.props.item,'asiYks');
  }
  voteTwo(){
    Meteor.call('voteOnItem',this.props.item,'asiKaks');
  }
  render() {
    return (
      <div className='item'>
      <div className='vote-one' onClick={this.voteOne.bind(this)}>
      <span> {this.props.item.asiYks.value} </span>
      <h3>{this.props.item.asiYks.text}</h3>
      </div>
      <span>vs</span>
      <div className='vote-two' onClick={this.voteTwo.bind(this)}>
      <span> {this.props.item.asiKaks.value} </span>
      <h3>{this.props.item.asiKaks.text}</h3>
      </div>
      </div>
    )
  }
}

Items.js:

import { Mongo } from 'meteor/mongo';
const Items = new Mongo.Collection('items');
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;

_App.j_s:

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
    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(() =>{
  return {
    items: Items.find({}).fetch()
  }
},App);