Kotlin – SpringBoot + Jquery JsonP for requests to cross domain

In the post, JavaSampleApproach will show you how to use JQuery JsonP Request to Kotlin SpringBoot server without worrying about cross-domain issues.

I. Technologies

– Kotlin 1.2
– Java 1.8
– Maven 3.6.1
– Spring Tool Suite – Version 3.9.0.RELEASE
– Bootstrap
– Spring Boot – 1.5.10.RELEASE

II. Jquery JsonP and Kotlin SpringBoot

JSONP is a solution to resolve cross-domain issues which uses script tag instead XMLHttpRequest object.
With JQuery, we can use it as below:

To support JSON-P with SpringBoot RestAPI, we use AbstractJsonpResponseBodyAdvice by Kotlin language:

Returned result is a Javascript object, NOT Json:

kotlin springboot jquery jsonp - preview

III. Practice

We create 2 SpringBoot projects as below:

kotlin springboot jquery jsonp - projects

Steps to do

– Implement JQuery Front-end

  • Create SpringBoot project
  • Create Web Controller
  • Create index.html file
  • Implement Jquery Ajax

– Implement SpringBoot Backend

  • Create SpringBoot project
  • Create data models
  • Implement RestApi
  • Configure JsonpResponse advice

– Run and check results

1. Implement JQuery Front-end
1.1 Create SpringBoot project

Use SpringToolSuite to create a SpringBoot project KotlinSpringBootJQueryJsonp with dependencies:

1.2 Create Web Controller

1.3 Create index.html file

1.4 Implement Jquery Ajax

2. Implement SpringBoot Backend
2.1 Create SpringBoot project

Use SpringToolSuite to create a SpringBoot project SpringBootJsonPRestAPI with dependency:

2.2 Create data models

– Create Address model:

– Create Customer model:

2.3 Implement RestApi

2.4 Configure JsonpResponse advice

3. Run and check results

Run 2 above SpringBoot projects. -> Results:

kotlin springboot jquery jsonp - response

kotlin springboot jquery jsonp - preview

kotlin springboot jquery jsonp - view

IV. Sourcecode


By grokonez | February 9, 2018.

Related Posts

Got Something To Say:

Your email address will not be published. Required fields are marked *