I am looking to create a web widget that can be easily integrated into any website using javascript and posts a form to my server, returns the data and displays the results appropriately. This will all happend in a small area of the host websites screen, like google adsense. I am aware that this is XSS and also the cross domain issues with ajax.
What I need help with is cementing the flow of such a widget. Has anyone done anything like this before?
The general process is:
Website embeds javascript - external js
Javascript renders a form
User submits form with POST data
POST data is sent to external server
Server responds and updates widget to display tabular data
Is this possible? How could it be achieved? Should I use / avoid using a JS framework such as Prototype / JQUery for this project?
If anyone knows any good tutorial resources for building widgets that would be great.
Any help would be greatly appreciated.
using a library like jQuery is not possible, since you don't know whether the website that uses your widget has the jQUery-library referenced.
If you use an iframe, and show something of your own host, you are able to use a library if I'm not mistaken.
Related
I know this question sounds really suspicious, but I'm in a weird situation where I've taken control of a project, but the original vendor that built the website retains ownership of the server and the server-side code.
I've successfully scripted a lot of my interactions with the website through Selenium, but one of the activities I need to script is to submit files through a Silverlight form. From what I understand, you can't interact directly with Silverlight from Python or with Selenium, but looking at the source code it looks like the Silverlight is just used to get a file location and display a loading bar, and the actual form submission is done via post to an ASP server-side script. But it has several hidden validation fields.
So I'm kind of envisioning a path where I navigate to this page with Selenium, then parse that page for the validation values, and then submit the form with those values and the data that I want to upload.
Is this approach viable? Where can I find information on something like this and the difficulties involved?
Silverlight can be automated via Windows accessibility interfaces. The scope of this is too big for a stackoverflow post, but I suggest you have a look at this: https://msdn.microsoft.com/library/ms727247(v=vs.100).aspx
You can drill use UI Spy to drill down to control IDs and then use Python's COM interop to call the UI Automation APIs.
When NOT using AngularJS, I create a web site that responds to /mysite/users . It returns an HTML page with user records filled within a table-like display.
I wish to try an AngularJS approach. I somehow load the web page, and that page's onload() calls /mysite/users, which returns merely a JSON list of users.
The "somehow" part is what bothers me. So far I'm reduced to first calling /mysite/showUsers. This downloads the HTML page which then itself calls /mysite/users.
Likewise, when editing with AngularJS I think I'll have to call /mysite/userEdit/1 which on load calls /mysite/user/1.
I think I'm missing something. Can I get a clue?
Thanks,
Jerome.
As you've noted, the AngularJS approach is not to load pre-rendered HTML from the server, but instead load a list of JSON data and rely on AngularJS directives to populate the DOM client-side.
A concrete example in your case would be a page which loads an Angular module that fetches a JSON list of users from /api/users, and leverages the ng-repeat directive to populate the data into the page right in the visitor's browser. Here's a JSFiddle I found that illustrates how you'd accomplish this.
It's all a matter of where the data gets inserted into the HTML; It can happen on the server-side or the client-side, and Angular favors the latter. (This is not to say you can't load pre-rendered HTML from the server, but you would be working against the way AngularJS is designed to be used.)
I've had trouble describing what I want to have happen. Perhaps it is because it goes against the grain of Angular.
My server responds to /user/1 with the JSON for user #1. For the browser to deal with it, I must have a web page already there that can display this JSON. Chicken and egg style, how do I get this edit web page into the browser? My classic example is using /user to list the users and having a link on each user to edit it, such as "/SOMETHING/1".
In the meantime, I've decided to go with /user/edit/1. That will cause the server to render an HTML file, using server-side scripting to insert a phrase that on window.onload() fills the skeleton HTML with the result of /user/1.
Thanks, Collin, for replying.
I have some data in my database. I would like to offer to my readers a posiblity to load data from my database on their website - something very similar does Google with - for example - Google Analytics, where is provided to users a piece of HTML code that users put into the HTML code of their websites and on the spot where is the code from the Google part included are displayed the respective data.
I have never been working with the technique that is needed for this purpose, so I am not sure how to implement it/what is needed for it.
I would be grateful for pointing me to the right direction.
Thank you guys.
You could implement an API
http://railscasts.com/episodes/348-the-rails-api-gem
the idea to send data RESTfully as JSON or XML
then parse that the using javascript (jquery,angular,etc..) to display it as HTML
This main challenge in creating an API is authentication.
You take a look at Oauth and Doorkeeper gem for rails
I have a php program/app which asks for input, generate an image and post th image link to user's timeline (processor.php). I used PHP SDK in posting to timeline since I am more familiar with PHP. Now, in my gallery.php, i want to show like buttons for each generated image. I am aware that i have no option but use JS SDK in making button. but is it fine if i use two different SDK's in a single app?
processor.php - PHP SDK
gallerry.php - JS SDK
thanks for your answer! I would love to try your suggetions too
There shouldn't be any problem using PHP and JS in the same application, quite a common use case. You would normally use PHP to create the Web Application structure, handle backend logic, and then use JS to handle UI events.
There's nothing special about combining the two, just create the Web page with JS as normal for the view, and use PHP to build it.
Hope this helps.
Yes, there is no problem, the two APIs are designed to work together. The PHP API is usually used to created the backend logic (for example OAuth implementation, posting and getting data, etc) and the JS API to handle user iniated events.
Also see this: https://stackoverflow.com/a/6728092/1107118 on how to handle login state. Normally the JS API is used for logging in too, and then with the PHP API you take the access token and do the backend actions.
I am writing a web application using Pyjamas. .
The core functionality of my application is to show some Events which are generated asynchronously, in an HTML table (using the corresponding pyjamas widget).
Is it possible to send these notifications to the pyjamas application running in the browser?
I have been looking for an example without success.
I don't know if you are familiar with the pyjamas bookreader?
If not, there's a lot of information and some examples about ajax over there.
http://pyjs.org/book/Bookreader.html#Rest%20of%20the%20World