Member Avatar for sashika_sur
sashika_sur 0 Newbie Poster

I have dynamic page which is loading and preview page from database retrieved values. I did this with successfully. I want to remove parameters from page url. Note that I only used one parameter in url.
My url is something like this. (with parameters)

I tried to remove parameters from url, (it success) then my url look like this,

To do that I added following codes to htaccess file, 

RewriteEngine On
#RewriteCond %{SERVER_PORT} 80
ReWriteRule ^ad/([a-zA-Z0-9-/]+)$ ad.php?url=$1
ReWriteRule ^ad/([a-zA-Z0-9-/]+)/ ad.php?url=$1
Options +FollowSymLinks -MultiViews
# Turn mod_rewrite on
#RewriteEngine On
RewriteBase /

# To externally redirect /dir/foo.php to /dir/foo
RewriteCond %{THE_REQUEST} ^[A-Z]{3,}\s([^.]+)\.php [NC]
RewriteRule ^ %1 [R,L,NC]

## To internally redirect /dir/foo to /dir/foo.php
RewriteCond %{REQUEST_FILENAME}.php -f [NC]
RewriteRule ^ %{REQUEST_URI}.php [L]

Everything load properly inside page except ajax retrieving values. There are three ajax functions in my page which is loading some data to DIVs. Those are not working after I remove parameters from url using above rewrite rules.

For understanding I will add one of my ajax function below,

  function load_reviews(){
        var id = "<?php echo $ad->get_ad_id($unique_ad_url) ?>";
        $.ajax({
            url: './middle/review/load_reviews',
            cache:true,
            type: 'GET',
            async: false,
            data:{
                id: id
            },
            success: function(response){
                $('#chat_area').html(response);
            },
            error: function (x, e) {
                if (x.status == 0) {
                    console.log('You are offline!! -  Please Check Your Network.');
                } else if (x.status == 404) {
                    console.log('Requested URL not found.');
                } else if (x.status == 500) {
                    console.log('Internal Server Error.');
                } else if (e == 'parsererror') {
                    console.log('Error. - Parsing JSON Request failed.');
                } else if (e == 'timeout') {
                    console.log('Request Time out.');
                } else {
                    console.log('Unknown Error. - ' + x.responseText);
                }
            }
        });
        return false;

    }

Now when I open the page, inside those DIVs which are supposed to show data from database shows entire same page inside that DIV as small.

Capture.PNG

And another thing is when I check network responses from google chrome developer tools it shows infinite of files loading. (css, js, ajax responses) . Guys I need your assistence and I appreciate it .

  • 1 Contributor
  • 0 Replies
  • 468 Views

Dani AI

Generated

Two things are happening at once: the browser is resolving your relative AJAX URL against the current pretty URL (so ./middle/review/load_reviews becomes /ad/.../middle/review/load_reviews) and your rewrite rules are broad enough to catch those requests and return the full HTML page. That explains why the DIVs get the entire page and why CSS/JS show repeated HTML responses in Network — the server is serving your page for asset/AJAX URLs instead of the real file/endpoint.

Make the rewrite rules only handle intended slugs and let real files/directories (and your API folder) pass through. Also stop using relative AJAX paths that depend on the current URL. Example .htaccess (drop into your site root):

RewriteEngine On
RewriteBase /

# Serve existing files and directories as-is
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]

# Don't rewrite requests to these folders (ajax endpoints, assets)
RewriteRule ^(middle|assets|css|js|images)/ - [L,NC]

# Pretty ad slug -> actual PHP file
RewriteRule ^ad/([^/]+)/?$ /ad.php?url=$1 [L,QSA]

On the client side, change the AJAX URL to an absolute path so it does not inherit /ad/... as a base. For example:

url: '/middle/review/load_reviews',   // leading slash
dataType: 'html',                     // if returning HTML
async: true

Quick debugging checklist:

  • In DevTools Network click one of the asset/AJAX requests that returned HTML; check Request URL and Response headers (Content-Type). If you see text/html for a CSS/JS URL, the rewrite is catching it.
  • Temporarily rename .htaccess to confirm the problem goes away.
  • If you still need the “remove .php” redirect you had, make it very narrow (exclude middle, assets, etc.), because the generic THE_REQUEST -> strip .php rules commonly create redirect / rewrite loops.
  • Add a small marker header or echo in your AJAX endpoints (or ad.php) while debugging so responses can be identified easily.

Follow those steps and you should see the AJAX endpoints return their proper responses instead of the whole page.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.