Since I am new to laravel api, I don't know hot to connect laravel api to html endpoint. My laravel api is working well and html web pages also completely finish. I just want to connect them together... Please explain how to connect these two.
Thank you
I would suggest two ways to go about this but it all depends on what your API does. If you are looking to serve the HTML with Laravel and have some parts of the application loaded by Laravels view() method, you'd basically need to break your HTML into blade files in resources/view folder and call the blade files via view() in controller to load the desired page.
However if you are looking for a separation of view and API where API is called by the view only for some information, you'd need to utilize AJAX via JavaScript to make a call to the API endpoint and retrieve the data (JSON) for use in your HTML site.
I use axios a lot and here is a sample call:
axios.get(url).then(response => { // do whatever here with the response data });
I'm not sure I understand you. But it reads like you developed your Laravel Application (PHP) and HTML separately. Laravel uses Blade (see: https://laravel.com/docs/7.x/blade) as a template engine into which you can inject PHP objects. Basically, the call of a web page (more or less) works like this:
The user is calling the url
URL goes to the routes/web.php
in this file you can call e.g. a controller
the controller called via (e.g.)
return view('my.site.nice-site', [ key => value]);
blade starts and displays the page to the user with the given key as variable.
I hope this helps you a bit. Otherwise I recommend, just to get started, the documentation from Laravel or YouTube.
Related
I have researched how to send data from Rails to JavaScript in a Slim view template, and the most accepted method is to declare a Ruby section on the Slim template to get the data from the controller, and then declare a JavaScript section to store that data into a window variable, and then load the JavaScript pack that's going to use that data.
The data is needed to build a JavaScript snippet that will go in the <head> of our app.
Here's an example of what I'm doing (this is the app/views/layouts/_my-template.html.slim file):
ruby:
myDataFromRails = #my_data.to_json.html_safe
javascript:
window.myData = #{myDataFromRails};
- include_javascript_pack 'my-pack'
The problem with this method is that all the data coming from the Rails backend is available for anyone that inspects the code or types window.myData in the developer tools console, which is not ideal...
Another option will be to query the backend from the JavaScript snippet itself, using an HTTP request, but this doesn't look like an efficient way of getting the data from the backend.
I am currently working on my self-project using Node.Js (Express) + MongoDB + Javascript/Jquery + HTML (using EJS as my template engine).
Currently I have some knowledge of sending data from Node.js router to Views and sending form data from Views back to router using "POST" and "GET" method.
I was wondering if there are other methods of sending a data from Views to Node.js router without going through
<form action="/" method="POST">
...
</form>
methods...
I have no knowledge on Angular2 and REACT..
For example, I am trying to send back the updated data from Views (probably using Jquery's editable() plugin to simply edit a text that was generated from MongoDB and send the updated contents back to server so I could update MongoDB
and save contents based on updated contents.
I feel like using a form should be only done once when I want to add new stuffs into DB...please help me out! Some of the stuffs I am asking are vague but these are the best I can explain. Or learning Angular2 is the best approach Lol ?
It sounds like you want to learn about $.ajax (if you're using Jquery) or XMLHttpRequest (if you aren't). That is significantly more versatile than forms (though you still should use a form to hold the entry fields; just don't give it an action if you're using a JavaScript-based AJAX call instead).
If updating an existing entry, you probably want the PUT method.
I searched a lot but unable to find the solution for this.
In angular 1.x, I used to include js in php pages and load the pages from server side code like CodeIgniter controller.
In angular 2.x, I unable to figure out that how I use server side features like $_SESSION?
e.g. I want to insert the data to mysql table and I will send data using POST service of Angular 2. How can I achieve that which user is logged in and created that record??
$city = $this->input->post("city");
$specialty= $this->input->post("specialty");
$data = array("city"=>, "specialty"=>$specialty, "createdBy"=>$this->session->userdata("userid"));
$this->db->insert("citywise", $data);
How to get this $this->session->userdata("userid"); because application is loading at client and everything is handling like REST services.
Using localStorage I can get login data on client browser but what about server?
Use JWT(Json Web Token) for the same purpose
refer this link
I have created a web application and deployed it in my tomcat. The API is a GET request and URL is: http://mymachine.home.net:8080/test.app-1.0/test/json which returns an output as:
{"details":[{"name":"tim","age":"13"},{"name":"jim","age":"15"}]}
I want to write a very simple extjs application that will call the URL and print the response (or write the response to a file). Can someone help me with this? I tried the examples mentioned at many places, but my URL is never hit from the extjs application.
Thanks in advance
This was resolved. A few things that I added / changed were:
I included ext-all.js in the index.html page.
The response returned from the web application was changed as:
someCallback({"summary":[{"hits":9118,"avg":13,"min":1,"max":1448,"errors":0,"date":"This period"},{"hits":1,"avg":1,"min":1,"max":1,"errors":0,"date":"Average"}]});
The callback name (someCallback) is sent as query parameter to the web application. The URI was changed to http://mymachine.home.net:8080/test.app-1.0/test/json?callback=someCallback
The response has to be wrapped around a string like ‘someCallback(…)’, else the Extjs code will not be able to parse it.
I'm new to BackBone and building my app based off a template found on the web. I start by loading my data from file.json like so...
livestock.groups = Backbone.Collection.extend({
model: livestock.Activity,
url: "groups.json"
});
I then have several lines of code loading the collection to the HTML and setting button functionality. Then near the end I have a line which updates the extended collection like this...
function addToList(activity) {
livestock.groups.add({id: 6, type: activity, comments: 'Wow...that was easy.'});
}
This works fine for the HTML version of the collection but I want to add a line to addToList function that will update my .json file. How can this be done?
This isn't actually possible. Backbone was meant to interact with a RESTful web service. When you give it the URL to a JSON file like your'e doing, it sends a GET request, which works fine. It doesn't know whether or not it called a web service or not. However, when you want to send the update to the collection, it generates an HTTP POST request. However, that doesn't do any good submitting a POST request to a static file. Apache or whatever you're using to host the JSON file will probably ignore that and serve the static file again.
The real problem, however, is unrelated to Backbone itself. The problem is you can't edit a file on a remote server via javascript. You need some web service in between using something like PHP or Ruby that can take the request from Backbone and update the file on the server's hard drive.
If instead you're developing right now on your local computer, then this won't work for a different reason. Your browser, for security reasons, won't allow javascript to modify local files on your hard drive, even though they're in the same folder as your html and javascript.
Hope this helps.
Edit: Based on comments, adding links here to a couple sample adapters for Backbone to LocalStorage and IndexedDB:
http://documentcloud.github.com/backbone/docs/backbone-localstorage.html
https://github.com/superfeedr/indexeddb-backbonejs-adapter