As a newbie to meteor, I found lacking security is one of the first impressions people usually have due to meteor's historic debut and that meteor has taken measurements to address the concern. Therefore I pay more attention to this subject as I am learning it. When following the to-do list tutorial, I noticed, to my surprise, the if (Meteor.isServer) {} block is visible in browser. The tutorial dedicated 2 steps out of 12 to move client-side code to server-side to make it secure. But if server-side code is also visible in browser, isn't that defeated the whole purpose? How could meteor be a secure platform in that regard?
The tutorial is using this simple technique to start things quickly, but hopefully there is a built-in way to prevent server code being sent to the browser.
Every code that you put in the server directory won't be shipped to the client.
Likewise, source code living under the client directory only lives in the browser environment.
This is detailed in the docs section relative to "Structuring your app" :
http://docs.meteor.com/#/full/structuringyourapp
Related
So, I want to apologize ahead of time but I've been googling and stack overflowing for an answer to this question and I just can't find a satisfactory one.
I know that Facebook uses React and, although I don't know what software architecture they use (MVC, Client-Server etc.), I can't see any react files or react components in the dev tools sources tab on any browser.
I'll show you an example in my own react app using create-react-app that shows all my files:
Create-react-apps dev tools sources:
However, when I go to Facebook's page, I don't see anything like that. I see this:
Facebook's dev tools sources:
This isn't only true of react apps, but just node apps I've made as well. Now, I want to know where all of this information is on facebook's page.... Where are the components? Why can't I see them? Where are all the post and get requests being run? How can I put breakpoints in the code for debugging? I mean, I don't even see an HTML page besides the elements tab! And, most importantly, how do I do the same thing to hide my files?
It seems like it adds an extra layer of security that I would think is preferable on all public websites. Once again, thanks in advance and, as far as I know, the answer to this is nowhere near obvious.
I admit, this one little bit confusing when you are quite new on the web development.
You can see your files (source code) via devtool because you also upload your .map files which help map your bundled/minified code into the the original readable one.
However, this is super helpful on development environment, but quite dangerous on production. What you need to do just remove the .map files, as comment suggested.
To the point, I'm working a React app that has "levels" where users have to completely some tasks before then can move on to the next one. And for obvious reasons I can't use client-side js to verify and advance the user to the next level.
I believe that a server should handle this, but I'm stuck on how to go implementing this. I've tried Googling for this but I'm not sure if I can accurately put this into keywords. Some of my current thoughts:
Render React components of each levels to static html then serve this page when the correct request is made to the server (https://reactjs.org/docs/react-dom-server.html). As my whole app is running client-side now, I'm worried that this will complex things a lot more.
Keep all the components client-side but only return the link (route) to the page if a request is made to the server. This way someone extremely motivated can still see all the pages without completing the tasks.
I believe there should be an obvious answer to this question but since I'm relatively new to React, I'm not sure what it is.
Thanks.
React is a client-side framework. Meaning it is run and rendered in the browser.
When you talk about "the server" you are needing to implement a backend framework (i.e. RoR or Express), this is something you will have to learn independently. There are many tutorials online that are free.
I am new to web development and have put together a decent Angular 2 MEAN web-app that I would like to launch relatively soon. Unfortunately PayPals documentation is such a gigantic Kafkaesque clusterf maze swamp mire that I am lost in and have no clue what I'm doing, I have 30 browser tabs open including code examples and their node sdk/REST. I've tried a few of the different options on offer which involved pasting their scripts to try get a button but nothing happened. Does anyone have a simple guide I can follow and a simple recommendation for integrating paypal payments into MEAN stack? I just need to be able to set payment amounts based on data that is contained in objects I have access to in my front-end, so a simple front-end solution would be nice where user can pay with paypal account or credit card and where I can plug the variable {{event.price}} straight into paypals api and send it off, and verify it somehow.
Thanks
Hope I'm not being to general but: I have been tasked with the job of "rejuvenating/modernizing" a monolithic Java EE (JSF/CDI/EJB/JPA) app. Since the requirements state that it should support multiple clients, I have split up the code in a server (JAX-RS interfaces) and a client part (not yet done)
The server is pretty straightforward but I'm wondering about the UI part. Nowadays (hope I don't sound too oldskool) various Node JS spin-offs seem to be popular but I'm under the impression that they have the most value to offer in the "scalable server" section. Does the various Angular/React/Node framework have anything to offer for the client if you have something more complex than a single page app?
It appears to be a really hard time to pick a UI technology nowadays. Sure, the server/DB part which contains most of the business logic are pretty future-proof but still, one would like to focus on one UI technology. There are various jQuery-based frameworks like Kendo, Vaadin & co etc. One option would be to stick with JSF + ICEfaces/PrimeFaces and just work with the REST interface. And then there is JavaFX which looks nice but the future looks a bit uncertain.
So. If the backend is not going to be Node JS, does Node JS have anything to offer for the UI part that can't be done more easily with other frameworks and does anyone have other insights on the UI layer in general. Predicting is hard, especially the future ;-)
Node.js is a way to run javascript on the server side, not client side. That said, npm (nodes package manager) or its wrappers (like bower) are quite often used to manage the client side dependencies - which is very useful to have.
Angular and react (among others) are client side javascript ui frameworks to help make writing ui much nicer. Neither depend on the backend being written in node.js and can work with any rest api (or other server side apis) - or no api at all if that backend injects all the data the page needs into the page itself.
Electron, which combines NodeJS and Chromium (render Process).
https://electronjs.org/
Formerly known as atom shell it was created by Github, it is the core of the Atom Editor, VS Code, Slack app, and a ton of “thick client” applications. https://en.m.wikipedia.org/wiki/Fat_client
There are several implementations which allow you to use Node.JS modules on a client-side (ie. web browser). You can then use html/css and call Node.JS modules directly from your DOM which is used to implement UI.
I'm most familiar with NW.js which I've used couple of times. Others would be for example Electron or AppJS
I'm a beginner in creating mobile apps with phonegap. I have some doubts on security aspects, when creating a mobile app with phonegap.
I want to create an app that accesses a Web service, e.g. a REST service created using Jersey. Now, am I correct in thinking that a hacker can easily see the security keys/authentication mechanism used, to authenticate the client (on a mobile app) with the server (where REST API is to be used)?
In general, can a hacker easily access all data being sent by the mobile app (which was created using phonegap)?
Can a hacker disassemble a phonegap app to obtain original code? Wont he get the native code (e.g. Objective C in case of ios)? Or can he decompile even that into original phonegap code (ie html+js)? How do I prevent my code from being decompiled? Is this scenario the same as for most other languages i.e. hackers with powerful PCs can hack into just about any program/software? Is there some way to prevent this from happening?
Allright, first take a deep breath. You are probably not going to like some of my answers but you'll be living with the same issues that we all are.
The best thing to do in this case is to use something like the KeyChain plugin to retrieve your security keys from the native side.
You can take PhoneGap out of the question because it applies to any situation where you send unencrypted data between a client and server. Anyone can easily listen in using a number of tools including Wireshark or Ethereal. If you need to communicate with a sever it should be done on an encrypted, HTTPS or SSL, connection.
First I think you are under the mistaken impression that PhoneGap compiles your HTML/JS code into Obj-C. It does not. If the user uncompresses your app they will be able to read your HTML/JS. Also, they'll be able to decompile your Obj-C code as well. This does not take a powerful PC or even an experienced hacker. Pretty much anyone can do it.
My advice to you is not to worry about it. Put your time into creating a truly great app. The people who will pay for it will pay for it. The folks who decompile it would never buy the app no matter what. The more time you take trying to combat the hackers takes away from the time you could use to make your app greater. Also, most anti-hacking measures just make life harder for your actual users so in fact they are counter productive.
TLDR -
Consider that you are coding a website and all code ( html and js ) will be visible to user with
Crtl+Shift+i as in browsers
Some points for ensuring maximum security
If your using backend then recheck everything coming from the app
All attacks possible on websites (XSS, redicting to malacious webistes , cloning webistes, etc are possible )
All the data sent to the app will finally be available in some js variables / resource files , Since all variables are accessible by hacker so is all the data sent to app EVEN IF YOU ARE USING THE MOST SECURE DATA TRANSMISSION MECHANISMS
As Simon correctly said in his ans , phonegap or cordova does not convert html / js to native code . Html / Js is available as-it-is
Cordova also explicitly mentions this in their official statement
Do not assume that your source code is secure
Since a Cordova application is built from HTML and JavaScript assets that get packaged in a native container, you should not consider your code to be secure. It is possible to reverse engineer a Cordova application.
5.Mainly all the techniques which are used by websites to prevent their code from being cloned / easily understood are applicable even here (Mainly it includes converting js code into hard to read format - obfuscating code)
6.Comparing native apps with cordova/phonegap apps native apps , I would say that cordova are easier for hacker only because of lack of awareness between cordova developers who do not take enough measures to secure it and lack of readily available(one click ) mechanisms to directly obfuscate the code vs in android proguard
Sample Cordova App Hacking (NOTE:Phonegap also works in similar way)
I'll show an example to show how easy is it for hacker to hack a cordova app(where developer has taken no efforts in obfuscating the code )
basically we start with unzipping the apk files (apks can be unzipped like zip files )
The contents inside will be similar to this
The source code for cordova apps is present in /assets/www/ folder
As you can see all the contents including any databases that you have packed with the app are visible(see last 2 rows have a db file )
Along with it any other resources are also directly visible (text files/js / html/ audio / video / etc)
All the views / controllers are visible and editable too
Further exploring the contents we find a PaymentController.js file
Opening it we can directly see the js code and other comments
here we note that after user performs payment if it is successful then successCallback is called else cancelCallback is called.
Hacker can simply replace the two functions so that when payment is not successful successCallback is called .
In absence of other checks the hacker has successfully bypassed payment.